<template>
  <RTHeader label="培训环节" :statusInfo="statusInfo"></RTHeader>
  <component v-if="statusInfo.component" :is="statusInfo.component" @changeDate="changeDate" @dieOut="dieOut"
    @surrender="surrender" @disConnect="disConnect"></component>
</template>

<script setup lang='ts'>
import { ref, watch } from "vue";
import RTHeader from '../../RTHeader.vue';
import TrainExaminePass from "./TrainComponent/TrainExaminePass.vue";
import TraingExamine from "./TrainComponent/TraingExamine.vue";
import Training from "./TrainComponent/Training.vue";
import TrainMailSend from "./TrainComponent/TrainMailSend.vue";
import TrainTobeOrder from "./TrainComponent/TrainTobeOrder.vue";
import TrainWatting from "./TrainComponent/TrainWatting.vue";
import TrainAdmitted from "./TrainComponent/TrainAdmitted.vue";
const props = defineProps(['trainStatus']);
const statusInfo = ref<any>({
})
const trainStatus = {
  "待约培训": {
    component: TrainTobeOrder,

  },
  "待约培训-放弃": {

  },
  "待培训": {
    component: TrainWatting
  },
  "预约邮件已发送": {
    component: TrainMailSend
  },
  "预约邮件已发送-放弃": {

  },
  "培训中": {
    component: Training
  },
  "培训中-放弃": {

  },

  "培训中-淘汰": {

  },

  "考核": {
    component: TraingExamine
  },

  "考核评价": {
    component: TrainExaminePass
  },
  "待录取": {
    component: TrainAdmitted
  },
  "待录取-淘汰": {

  },
}
for (const key in trainStatus) {
  const el = trainStatus[key];
  el.status = key
  el.hr = "王xx" + key
  el.count = 1
}
watch(() => props.trainStatus, (val) => {
  statusInfo.value = trainStatus[val];
}, { immediate: true })

const emits = defineEmits(['surrender', 'disConnect', 'changeDate', 'dieOut'])
const surrender = (val) => {
  emits('surrender', val)
}

const disConnect = (val) => {
  emits('disConnect', val)
}

const changeDate = (val) => {
  emits('changeDate', val)
}

const dieOut = (val) => {
  emits('dieOut', val)
}
</script>
<style lang="less" scoped>
.btns {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
</style>